<script setup>
import { ref, watch } from 'vue';

const state = ref({count: 0})
const add = () => {
  state.value.count++
}
// 使用watch监听复杂类型时 需要开启深度监听 (第三个参数 {deep: true})
watch(state, (newCount,) => {
  console.log(`count发生了变化, 新值为${newCount.count}`)
}, {
  deep:true,
  immediate: true
})
</script>

<template>
  <div class="app-page">
    {{ state.count }}
    <button @click="add">加一</button>
  </div>
</template>

<style scoped></style>
